<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" %>
<!DOCTYPE html>
<html>

<head>
    <title>轮播图管理</title>
</head>

<body>

<div id="wrapper">
    <div class="gray-bg">
        <div class="row  m-t-sm">
            <div class="col-lg-12">
                <ol class="breadcrumb f-fl">
                    <li>
                        <i class="fa fa-location-arrow"></i> <a>运营管理</a>
                    </li>
                    <li class="active">
                        <strong>轮播图列表</strong>
                    </li>
                </ol>
                <span class="navbar-right  m-r m-t-8"><a href="${ctx}/admin/banner/edit?" class="btn-primary btn-add "> <i class='fa fa-plus-square-o'></i> 新 增</a></span>
            </div>
        </div>
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox">
                        <div class="ibox-content">
                            <div class="search-area">
                                <form role="form" class="form-inline" id="queryform">
                                    <label for="title">
                                        <input type="input" placeholder="广告名称" name="title"
                                               id="title"
                                               class="form-control form-filter"></label>
                                    <label for="title">
                                        <select name="hrefType"  class="form-control form-filter" form="queryform" style="width:100%">
                                            <option value="">全部类型</option>
                                            <option value="1">图文</option>
                                            <option value="2">内链</option>
                                            <option value="3">外链</option>
                                        </select></label>
                                    <label for="title">
                                        <select name="status"  class="form-control form-filter" form="queryform" style="width:100%">
                                            <option value="">全部状态</option>
                                            <option value="1">使用中</option>
                                            <option value="0">已停用</option>
                                        </select></label>


                                    <button class="btn btn-primary" id="btnSearch" type="button" onclick="submitFilter()" > 查询</button>
                                    <button class="btn btn-primary" datatable-clear type="button"> 清除</button>
                                </form>
                            </div>
                            <div class="table-responsive">
                                <table class="table table-striped table-bordered table-hover dataTables" id="data-table"></table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>


<!-- Page-Level Scripts -->
<script>
    $(document).ready(function () {
        var setting = {
            "ajax": {
                "url": "${ctx}/admin/banner/list",
                "type": "POST"
            },
            "columns": [
                {"title": "排序", "data": "sortNumber", "width": "8%", "orderable": false},
                {"title": "广告图片", "data": "image", "width": "10%", "orderable": false},
                {"title": "广告名称", "data": "title", "width": "10%", "orderable": false},
                {"title": "类型", "data": "hrefType", "width": "10%", "orderable": false},
                {"title": "启用时间", "data": "operTime", "width": "20%", "orderable": true},
                {"title": "启用状态", "data": "status", "width": "10%", "orderable": false},
                {"title": "操作", "data": null, "width": "22%", "orderable": false}
            ],
            "columnDefs": [
                {
                    "targets": 1,
                    "render": function (data, type, row, meta) {
                        if (row.image != null && row.image != ""){
                            return "<img src=" + row.image + " width='45px;' height='45px'/>";
                        }else {
                            return row.image;
                        }
                    }
                },
                {
                    "targets": 6,
                    "render": function (data, type, row, meta) {
                        var result =
                                "<a class='btn btn-xs default btn-editable' href='${ctx}/admin/banner/edit?id=" + data.id + "'><i class='fa fa-pencil-square-o'></i> 编辑 </a>"+
                                "<a class='btn btn-xs default btn-editable' data-opt data-opt-url='${ctx}/admin/banner/del' data-opt-pams='{\"id\":" + data.id + "}' data-opt-fun='$(\"#data-table\").DataTable().draw();'  ><i class='fa fa-minus-square-o'></i> 删除 </a>";
                        if (data.status == 1) {
                            result += "<a class='btn btn-xs default btn-editable' data-opt data-opt-url='${ctx}/admin/banner/grounding' data-opt-pams='{\"id\":" + data.id + "}' data-opt-fun='$(\"#data-table\").DataTable().draw();'  ><i class='fa fa-ban'></i> 停用 </a>";
                        } else {
                            result += "<a class='btn btn-xs default btn-editable' data-opt data-opt-url='${ctx}/admin/banner/grounding' data-opt-pams='{\"id\":" + data.id + "}' data-opt-fun='$(\"#data-table\").DataTable().draw();'  ><i class='fa fa-play-circle-o'></i> 启用 </a>";
                        }
                        return result;
                    }
                },
                {
                    "targets": 3,
                    "render": function (data) {
                        switch (data){
                            case 1:
                                return "图文";
                            case 2:
                                return "内链";
                            default :
                                return "外链";
                        }
                    }
                },{
                    "targets": 5,
                    "render": function (data) {
                        switch (data){
                            case 1:
                                return "使用中";
                            default :
                                return "已停用";
                        }
                    }
                },
            ],
            "order": [
                [0, "asc"]
            ]
        };
        /* Init DataTables */
        $('#data-table').DataTable(ehconfig.get_datatable_config(setting));
        submitFilter = function () {
            $('#data-table').DataTable().draw();

        }
    });
    //    function clean() {
    //        $('#begin_time1').val('');
    //        $('#begin_time2').val('');
    //        $('#type').val('');
    //        $('#data-table').DataTable().draw();
    //    }

</script>

</body>

</html>
